<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>查看人员详情 </title>
        <link rel="stylesheet" href="//unpkg.com/element-plus/dist/index.css">
        <link rel="stylesheet" href="${path}yq-big/static/css/el-com.css">
        <link rel="stylesheet" href="${path}yq-big/static/css/style.css">

        <script src="//unpkg.com/vue@next"></script>
        <script src="//unpkg.com/element-plus"></script>
        <script src="//unpkg.com/@element-plus/icons-vue"></script>
        <script src="//unpkg.com/element-plus/dist/locale/zh-cn"></script>
        <script src="//unpkg.com/axios/dist/axios.min.js"></script>
    </head>
    <body>
        <div id="list">
            <big-form :form-detail="formDiaDetail"></big-form>
        </div>
        <script type="module">
            import bigForm  from '/yq-big/components/form/bigForm.js'
            let data=${@jsKit.parser(items)}
            const List = {
                data() {
                    return {
                        // formDiaDetail: ${@jsKit.parser(items)},
                        formDiaDetail:{
                            formArray:[
                                {
                                    type: 'input',
                                    span: 24,
                                    basicInfo: {
                                        name: 'id',
                                        label: 'ID',
                                        default: data.id,
                                    },
                                    operation: {
                                        readonly: true,
                                    },
                                },
                                {
                                    type: 'input',
                                    span: 24,
                                    basicInfo: {
                                        name: 'name',
                                        label: '姓名',
                                        default: data.name,
                                    },
                                    operation: {
                                        readonly: true,
                                    },
                                },
                                {
                                    type: 'input',
                                    span: 24,
                                    basicInfo: {
                                        name: 'createTime',
                                        label: '创建时间',
                                        default: data.createTime,
                                    },
                                    operation: {
                                        readonly: true,
                                    },
                                },
                            ],
                            operation:{
                                detail:[
                                    {
                                        value: '确定',
                                        type: 'primary',
                                        plain: true,
                                        beforeIcon: 'Search',
                                        endIcon: 'Memo',
                                        method: this.ListClick
                                    }
                                ],
                                layout:{
                                    align:'center'
                                }
                            }
                        },
                    }
                },
                components: {
                    bigForm
                },
                methods:{
                    ListClick() {
                        console.log("返回列表按钮被点击");
                        window.location="http://127.0.0.1:8081/test/list";
                    },
                }
            };
            const list = Vue.createApp(List);
            list.use(ElementPlus, {
                locale: ElementPlusLocaleZhCn,
            });
            for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
                list.component(key, component)
            }
            list.mount("#list");
        </script>
    </body>
</html>